<template>
  <div class="member-apply1">
    <div
      class="contain"
      id="jhTable"
    >
      <!-- 待审核 -->
      <el-table
        class="table"
        stripe
        border
        cell-class-name="common-table__cell"
        header-cell-class-name="common-table__header"
        :data="waiteList"
        style="width: 100%"
        v-show="current === 1"
      >
        <el-table-column
          fixed
          prop="name"
          label="会员名称"
          align="center"
        ></el-table-column>
        <!-- <el-table-column prop="cardnum" label="证件类型" align="center">
        </el-table-column>-->
        <el-table-column
          prop="cardtype"
          label="证件类型"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="cardnum"
          label="证件号码"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="sex"
          label="性别"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="birthdate"
          label="出生年月"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="banktype"
          label="提现银行"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="usenum"
          label="提现银行账户"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="telnum"
          label="手机号码"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="outintegral"
          label="提现金额(元)"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="personaltax"
          label="个人所得税(元)"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="fee"
          label="手续费(元)"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="arriveintegral"
          label="实际到账金额(元)"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="insertdate"
          label="申请时间"
          align="center"
        ></el-table-column>
        <el-table-column
          label="操作"
          align="center"
          v-if="optShowTwo"
        >
          <template slot-scope="scope">
            <!-- <span>未处理</span> -->
            <!-- <span>{{scope.row.status == '0'?}}</span> -->
            <el-button
              type="text"
              class="operate"
              @click="openDialog(scope.row)"
            >审批</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- 页码数 -->
      <div
        class="table-pagination-number"
        style="padding: 20px 0;"
      >
        <div class="pagination-number">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="PageCurrentChange"
            :current-page="pages.pagenum"
            :page-sizes="[10,20, 30, 50,100]"
            :page-size="pages.pagesize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="pages.total"
            background
          ></el-pagination>
        </div>
      </div>
    </div>

    <el-dialog
      width="50%"
      :visible.sync="dialogTableVisible"
      class="jhdialog"
    >
      <div class="comTitle clearfix">
        <div
          class="titleName fl"
          v-html="companyInfo.name"
        ></div>
        <!-- <div :class="{'fr':true,'status':current===1,'pass':current===2,'red':current===3}">{{tabs[current-1].label}}</div> -->
      </div>
      <div style="padding:0 20px 20px;">
        <div class="title">提现信息</div>
        <ul class="info clearfix">
          <li>
            <div class="infoLabel">会员名称:</div>
            <div
              class="infoText"
              v-html="companyInfo.name"
            ></div>
          </li>
          <li>
            <div class="infoLabel">证件号码:</div>
            <div
              class="infoText"
              v-html="companyInfo.cardnum"
            ></div>
          </li>
          <li>
            <div class="infoLabel">提现银行:</div>
            <div
              class="infoText"
              v-html="companyInfo.banktype"
            ></div>
          </li>
          <li>
            <div class="infoLabel">银行账户:</div>
            <div
              class="infoText"
              v-html="companyInfo.usenum"
            ></div>
          </li>
          <li>
            <div class="infoLabel">手机号码:</div>
            <div
              class="infoText"
              v-html="companyInfo.telnum"
            ></div>
          </li>
          <li>
            <div class="infoLabel">提现金额:</div>
            <div
              class="infoText red"
              v-html="`${companyInfo.outintegral}元`"
            ></div>
          </li>
          <li>
            <div class="infoLabel">个人所得税(元):</div>
            <!-- <div class="infoText" v-html="companyInfo.nickname"></div> -->
            <div
              class="infoText red"
              v-html="`${companyInfo.personaltax}元`"
            ></div>
          </li>
          <li>
            <div class="infoLabel">手续费(元):</div>
            <div
              class="infoText red"
              v-html="`${companyInfo.fee}元`"
            ></div>
          </li>
          <li>
            <div class="infoLabel">申请时间:</div>
            <div
              class="infoText"
              v-html="companyInfo.insertdate"
            ></div>
          </li>
          <li>
            <div class="infoLabel">到账金额:</div>
            <div
              class="infoText red"
              v-html="`${companyInfo.arriveintegral}元`"
            ></div>
            <div style="color:#959595;font-size:14px;display:inline-block">(税后)</div>
          </li>
        </ul>
        <div
          v-if="current===1"
          class="tabShow"
        >
          <div class="title">提现审批结果</div>
          <div style="height:40px;display: flex;align-items: center;">
            <el-radio-group
              v-model="radio"
              style="padding:0 20px"
              @change="resultChange"
            >
              <el-radio label="1">通过</el-radio>
              <el-radio label="2">未通过</el-radio>
            </el-radio-group>
            <el-input
              v-show="radio==='2'"
              style="width:400px"
              placeholder="请填写未通过原因"
              v-model="textarea"
            ></el-input>
          </div>
          <div
            slot="footer"
            class="dialog-footer"
          >
            <el-button @click="concelCash">取 消</el-button>
            <el-button
              type="primary"
              @click="confirmCash"
            >提 交</el-button>
          </div>
        </div>
        <div
          class="tabShow"
          v-if="current!==1"
        >
          <div class="title">提现审批信息</div>
          <ul class="info clearfix">
            <li>
              <div class="infoLabel">审批结果:</div>
              <!-- <div
                :class="{'infoText':true,'pass':current===2,'red':current===3}"
                v-html="tabs[current-1].label"
              ></div> -->
            </li>
            <li>
              <div class="infoLabel">审批人:</div>
              <div
                class="infoText"
                v-html="companyInfo.auditorid"
              ></div>
            </li>
            <li>
              <div class="infoLabel">审批时间:</div>
              <div
                class="infoText"
                v-html="companyInfo.auditdate"
              ></div>
            </li>
            <li v-if="current===3">
              <div class="infoLabel">失败原因:</div>
              <div
                class="infoText"
                v-html="companyInfo.note"
              ></div>
            </li>
          </ul>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<style scoped lang='less'>
@import '../../socical/socialCheck/check.less';
.member-apply1 {
  background: #fff;
  // margin: 0 18px;
  // max-height: 500px;
  .contain {
    background: #ffffff;
  }
  .table {
    border: 1px solid #d2d2d2;
  }
  .dialog-footer {
    margin-top: 20px;
    text-align: center;
  }
}
</style>
<style>
.member-apply1 .el-dialog__header {
  padding-bottom: 0;
}
/* .main {
  padding: 0 20px;
} */
</style>


<script>
export default {
  data () {
    return {
      list: [],
      current: 1,
      dialogTableVisible: false,
      radio: "1", //提现状态
      textarea: "",
      bankInfo: ['中国银行', '中国工商银行', '中国农业银行', '中国邮政储蓄银行'], // 银行类型
      waiteList: [{
        nickanme: '',
        telnum: '',
        bankname: '',
        usenum: '',
        outintegral: '',
        inserdate: ''
      }],
      outid: '', //待审核id
      // 页码数
      pages: {
        total: 20,
        pagenum: 1,
        pagesize: 10
      },
      companyInfo: {},
      level: '0',
      addressOptions: [],
      global: {},
      optShowTwo: false
    }
  },
  props: ['type'],
  created () {
    this.global = this.GLOBAL;
    let department = JSON.parse(localStorage.getItem('userinfo')).department;
    if (department == "提现二部") {
      this.optShowTwo = true
    }
    this.waiteCash();

  },
  methods: {
    // clickTab (item) {
    //   switch (item.order) {
    //     case 1:
    //       this.current = item.order;
    //       this.waiteCash();
    //       break;
    //     case 2:
    //       this.current = item.order;
    //       this.successCash();
    //       break;
    //     case 3:
    //       this.current = item.order;
    //       this.failCash();
    //       break;
    //   }
    // },
    // 待审核
    // waiteCash (p) {
    //   let obj = {
    //     pagenum: p || 1,
    //     status: '0',
    //     pagesize: this.Page.pageSize,
    //     // province: this.searchData.province, //省份编码
    //     // city: this.searchData.city, //城市编码
    //     // area: this.searchData.area, //区域编码
    //     // begintime: this.searchData.begintime,
    //     // endtime: this.searchData.endtime,
    //   }
    //   this.$axios.post('/app/v1/platform/member/integerOutList', obj).then(resp => {
    //     if (resp.data.code === 1) {
    //       this.waiteList = resp.data.data.list;
    //       this.Page.total = parseInt(resp.data.data.totalnum); //总数
    //       this.Page.pageNum = parseInt(resp.data.data.pagenum); //第一页
    //       // this.Page.pageSize = parseInt(resp.data.data.pagecount); //当前页显示条数
    //       for (let i = 0; i < resp.data.data.list.length; i++) {
    //         this.waiteList[i].bankname = this.bankInfo[resp.data.data.list[i].banktype];
    //       }
    //       this.Page.pageNum = p || 1;
    //     }
    //   })

    // },


    //获取列表
    waiteCash () {
      if (!this.type) {
        return;
      }
      this.loading = true;

      this.$axios.post('/app/v1/platform/unusual/todoList', {
        "type": this.type,
        pagesize: this.pages.pagesize,
        pagenum: this.pages.pagenum
      }).then(resp => {
        if (resp.data.code == '1') {
          this.waiteList = resp.data.data.list;
          this.pages.total = Number(resp.data.data.totalnum);
          this.pages.pagesize = Number(resp.data.data.pagesize);
          this.loading = false;
        }
      })
    },
    PageCurrentChange (p) {
      if (this.current === 1) {
        this.waiteCash(p);
      }
    },
    // 审批对话框
    openDialog (row) {
      console.log(row)
      this.dialogTableVisible = true;
      this.outid = row.orderid;
      this.radio = '1';
      this.textarea = '';
      this.companyInfo = row;
    },
    //取消提现
    concelCash () {
      this.dialogTableVisible = false;
    },
    resultChange (r) {
      if (r === '1') this.textarea = '';
    },
    // 确定提现
    confirmCash () {
      if (this.textarea.trim() === "" && this.radio === "2") {
        this.$message({
          message: "请填写不通过原因!",
          type: "warning"
        });
        return;
      }
      let operation = this.radio === "1" ? "通过" : "驳回";
      this.$confirm(`此操作将${operation}该提现, 是否继续?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let obj = {
          outid: this.outid,
          status: this.radio,
          paymentdate: '',
          note: this.textarea,
          userid: this.companyInfo.userid
        }
		console.log(obj);
       this.$axios.post("/app/v1/platform/member/integerOutResult", obj).then(resp => {
          if (resp.data.code === 1) {
            this.waiteCash();
          } else {
            this.$message({
              message: resp.data.message,
              type: "error"
            });
            this.waiteCash();
          }
        })
        this.dialogTableVisible = false;
      }).catch(() => {
        this.$message({
          type: 'warning',
          message: '已取消'
        });
      });
    },

    handleSizeChange (val) {
      this.Page.pageSize = val;
      if (this.current === 1) {
        this.waiteCash();
      } else if (this.current === 2) {
        this.successCash();
      } else if (this.current === 3) {
        this.failCash();
      }
    }
  }
}
</script>
